<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@include file="../common/jspcommon.jsp" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>景区 - 爽客网</title>
<%@include file="../common/js.jsp" %>
<%@include file="../common/css.jsp" %>
<script type="text/javascript" src="js/jquery.ying.js"></script>
<link href="css/content.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="js/jquery.ying.js"></script>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=1.3"></script>
<script type="text/javascript" src="js/search.js"></script>
<!--[if ie]><script src="js/common/iepng.js" type="text/javascript"></script><![endif]-->
<!--[if ie 6]><link href="css/jrIE6.css" type="text/css" rel="stylesheet"><![endif]-->
<!--[if ie]><link href="css/jrIE.css" type="text/css" rel="stylesheet"><![endif]-->
</head>
<body>
	<!-- header -->
	<%@include file="../common/header.jsp" %>
    <!-- header-->
    
    <!-- secnav-->
    <%-- <div class="w100p">
    	<div class="w980 mg">
        	<div class="g_secnav">
            	<span>你当前所在的位置</span>
                <a id="province">${scenic.province }</a>
                <c:if test="${scenic.city!='' }"><a id="city">${scenic.city }</a></c:if>
                <c:if test="${scenic.county!='' }"><a href="#" id="county">${scenic.county }</a></c:if>
                <a style="text-decoration: none;">${scenic.name}</a>
            </div>
        </div>
  	</div> --%>
    <!-- secnav--end-->
    
    <!-- content-->
    <div class="w100p">
		<div class="w980 mg mt5 clearfix">
        
        	<!-- left -->
        	<div class="in_v_left">
            	<div class="v_lb_box">
                	<ul class="v_lb">
                    	<li>
                        	<a href="#" class="block"><img src="${scenic.image1 }" class="block" /></a>
                        </li>
                       <!--  <li>
                        	<a href="#" class="block"><img src="../../images/smallpic/ff8080811e71f3c7011e721d210a015b_648x297.jpg" class="block" /></a>
                        </li> -->
                    </ul>
                    <ul class="v_lb_nums">
                    	<li>1</li>
                        <!-- <li>2</li> -->
                    </ul>
                </div>
            </div>
            <!-- left--end-->
            
            <!--right-->
            <div class="in_v_right">
            	<div class="v_info_box">
                	<h1>${scenic.name }</h1>
                    <p>所属地区：<a href="#" id="district">${scenic.city }</a></p>
                    <p>景区地址：<i>${scenic.address }</i></p>
                    <p>开放时间：${scenic.opened }</p>
                    <p>景区主题：<a href="#">${scenic.subject }</a></p>
                     <div class="clearfix pt5">
						<a href="javascript:void(0)" class="m_collect_btn fl" onclick="keep('${scenic.id}','att')">我要收藏</a> 
						<a href="javascript:void(0)" class="m_collect_btn m_recommend fl ml20" onclick="dianping('${scenic.id}','att')">我要点评</a>
                    </div>
                    <div class="else_info">
                    	<a href="#con_desc" onclick="desc();">景区简介</a>
                    	<a href="#con_activity" onclick="activity();">特色活动</a>
                    	<a href="#con_traffic" onclick="traffic();">交通信息</a>
                    </div>
                </div>
            </div>
            <!--right--end-->
            
        </div>
    </div>
    <!-- content--end-->
    
    <!-- part2-->
    <div class="w100p">
    	<div class="w980 mg mt5 clearfix">
        	<!-- left -->
            <div class="in_v_left1">
            	<div class="in_com_box mb10">
                	<h1>景区搜索</h1>
                    <div class="in_com_info">
                    	<ul class="in_search">
                        	<li class="title">城市/景点</li>
                            <li><input type="text" class="tb" id="scenic_search"/></li>
                            <li><input type="button" class="btn" value="搜索" onclick="searchScenic()"/></li>
                        </ul>
                    </div>
                </div>
                <!-- <div class="in_com_box mb10">
                	<h1>旅游指南</h1>
                    <div class="in_com_info">
                    	<ul class="in_sub">
                        	<li>
                            	<a href="#"><i class="icon_guide1"></i>景区介绍</a>
                            </li>
                            <li>
                            	<a href="#"><i class="icon_guide1"></i>景区介绍</a>
                            </li>
                            <li>
                            	<a href="#"><i class="icon_guide1"></i>景区介绍</a>
                            </li>
                            <li>
                            	<a href="#"><i class="icon_guide1"></i>景区介绍</a>
                            </li>
                            <li class="last">
                            	<a href="#"><i class="icon_guide1"></i>景区介绍</a>
                            </li>
                        </ul>
                    </div>
                </div> -->
                <div class="in_com_box mb10">
                	<h1>热门景区推荐</h1>
                    <div class="in_com_info">
	                    <c:forEach items="${hotScenicList }" var="c">
	                    	<dl class="in_com_dl">
	                        	<dt><a href="${c.hyperlink }" target="_blank">${c.title }</a></dt>
	                            <dd>
	                            	<a href="${c.hyperlink }" target="_blank" class="block mt10"><img src="${c.picture }" class="block" /></a>
	                            </dd>
	                        </dl>
	                    </c:forEach>
                    </div>
                </div>
            </div>
            <!-- left--end-->
            
            <!-- right-->
            <div class="in_v_right1">
            
            	<!-- tabs-one-->
            	<div class="in_tabs_wrap">
                	<div class="in_tabs_menu">
                    	<ul class="clearfix">
                        	<li class="current"><a href="javascript:void(0)">打折门票</a></li>
                            <!-- <li><a href="#">自由行</a></li> -->
                        </ul>
                    </div>
                    <div class="content">
                    
                    	<ul class="data_head clearfix">
                        	<li class="col1">	
                            	门票类型
                            </li>
                            <li class="other">	
                            	市场价
                            </li>
                            <li class="other">	
                            	爽客价
                            </li>
                            <li class="other">	
                            	支付方式
                            </li>
                            <li class="other" style="width:135px;">	
                            	预订
                            </li>
                        </ul>
                        <div class="data_items">
                        <c:forEach items="${tList }" var="ticket">
                        	<!-- item_box-->
                        	<div class="item_box">
                                <ul class="data_item clearfix">
                                    <li class="col1">	
                                        <a href="javascript:void(0)" onclick="showCal('${ticket.id}');">${ticket.name }</a>
                                    </li>
                                    <li class="other farial lt">	
                                        ¥${ticket.priceMarket }
                                    </li>
                                    <li class="other farial fb clrf60">	
                                        ¥${ticket.priceMin }
                                    </li>
                                    <li class="other">	
                                        <c:if test="${ticket.payFrom=='01' }">线上支付</c:if>
                                        <c:if test="${ticket.payFrom=='02' }">到付</c:if>
                                    </li>
                                    <li class="other" style="width:135px;">	
                                        <input type="button" class="btn" value="预 订" onclick="showCal('${ticket.id}');"/>
                                    </li>
                                </ul>
                                <!-- show-->
                                <div class="show_else" style="display: block" id="sc_cal_${ticket.id }"></div>
                            	<!-- show--end-->
                            </div>
                            <!-- item_box--end-->
                        </c:forEach>
                        </div>
                    </div>
                </div>
                <!-- tabs-one--end-->
                
                <!--right-two-->
                <div class="need_info">
                	<h1><span>门票产品预定须知</span></h1>
                	<div class="detail">
                    	${scenic.notes }
                    </div>
                </div>
                <!--right-tow--end-->
                
                <!-- tabs-two-->
            	<div class="in_tabs_wrap">
                	<div class="in_tabs_menu">
                    	<ul class="clearfix">
                        	<li class="current" id="li_activity"><a href="javascript:void(0)" onclick="activity();">特色活动</a></li>
                            <li id="li_desc"><a href="javascript:void(0)" onclick="desc();">景区简介</a></li>
                           <!--  <li class="current"><a href="#">游客点评</a></li> -->
                            <li id="li_traffic"><a href="javascript:void(0)" onclick="traffic();">交通信息</a></li>
                        </ul>
                    </div>
                    <div class="content_box">
                   		 <div class="content" id="con_activity">${scenic.activity }</div>
                         <div class="content" id="con_desc" style="display: none;">${scenic.description }</div>
                         <div class="content" id="con_traffic" style="display: none;">${scenic.traffic}</div>
                    </div>
                </div>
                
                
                   <div class="com_dp_box">
                    	<div class=" dp_scores">
                            <h1 class="title">${scenic.name }</h1>
                            <p class="dp_nums"><span>${scenic.name }</span> 共有点评<i class="clrf60">${countAll}</i>个</p>
                            <dl>
                                <dt><span class="txt_tip">总体评价：</span><span class="star_s2 star_s2_${countInt}"></span><i class="ml5 clrc06">${countPJ}分</i></dt>
                                <dd><span class="star_s2 star_s2_5"></span><span class="process_bar"><i style="width:${countBy5/countAll*100}%"></i></span><span class="ml10">${countBy5}条</span></dd>
                                <dd><span class="star_s2 star_s2_4"></span><span class="process_bar"><i style="width:${countBy4/countAll*100}%"></i></span><span class="ml10">${countBy4}条</span></dd>
                                <dd><span class="star_s2 star_s2_3"></span><span class="process_bar"><i style="width:${countBy3/countAll*100}%"></i></span><span class="ml10">${countBy3}条</span></dd>
                                <dd><span class="star_s2 star_s2_2"></span><span class="process_bar"><i style="width:${countBy2/countAll*100}%"></i></span><span class="ml10">${countBy2}条</span></dd>
                                <dd><span class="star_s2 star_s2_1"></span><span class="process_bar"><i style="width:${countBy1/countAll*100}%"></i></span><span class="ml10">${countBy1}条</span></dd>
                            </dl>
                            <a href="#" class=" dp_btn1"><img src="../../images/smallpic/btn_3.gif" onclick="dianping('${scenic.id}','att');"/></a>
                    	</div>
                        <div class="user_comments">
                       		 <a name="discussa"></a>
                        	<ul class="user_dp_det">
                        	<c:forEach items="${dList}" var="discuss">
                            	<li>
                                	<div class="com_lr">
                                        <div class="l_box">
                                            <a href="#" class="block"><img src="${discuss.imageServer}${discuss.avatar}" class="pic" /></a>
                                            <span class="name">${discuss.memberName}</span>
                                        </div>
                                        <div class="r_box">
	                                        	<p><span class="mr10">总体评价：</span><span class="star_s2 star_s2_${discuss.overall}"></span></p>
	                                            <p>
		                                            <span class="mr30">
		                                            	人气：<c:if test="${discuss.popul==1}">很烂</c:if>
		                                					<c:if test="${discuss.popul==2}">一般</c:if>
							                                	<c:if test="${discuss.popul==3}">还好</c:if>
							                                	<c:if test="${discuss.popul==4}">较好</c:if>
							                                	<c:if test="${discuss.popul==5}">很好</c:if>
		                                            </span>
		                                            <span class="mr30">
		                                          	    娱乐：<c:if test="${discuss.recreation==1}">很烂</c:if>
						                                		<c:if test="${discuss.recreation==2}">一般</c:if>
						                                		<c:if test="${discuss.recreation==3}">还好</c:if>
						                                		<c:if test="${discuss.recreation==4}">较好</c:if>
						                                		<c:if test="${discuss.recreation==5}">很好</c:if>
		                                            </span>
		                                            <span class="mr30">
		                                            	服务：<c:if test="${discuss.serving==1}">很烂</c:if>
						                                	<c:if test="${discuss.serving==2}">一般</c:if>
						                                	<c:if test="${discuss.serving==3}">还好</c:if>
						                                	<c:if test="${discuss.serving==4}">较好</c:if>
						                                	<c:if test="${discuss.serving==5}">很好</c:if>
		                                            </span>
		                                            <span class="mr30">
		                                            	规模：<c:if test="${discuss.proportion==1}">很烂</c:if>
						                                	<c:if test="${discuss.proportion==2}">一般</c:if>
						                                	<c:if test="${discuss.proportion==3}">还好</c:if>
						                                	<c:if test="${discuss.proportion==4}">较好</c:if>
						                                	<c:if test="${discuss.proportion==5}">很好</c:if>
		                                            </span>
	                                            </p>
	                                            <p>${discuss.content}</p>
	                                            <div class="result">
	                                            	<span class="fr">
	                                            		<fmt:formatDate value="${discuss.gmtCreated}" pattern="MM-dd HH:mm" />
	                                            	</span>
	                                            </div>
	                                        </div>
                                	</div>
                                </li>
                                </c:forEach>
                            </ul>
                        </div>
                    </div>
                
                <!-- tabs-two--end-->
                <div class="in_tabs_wrap">
	            	<div class="content_box">
	                	 <div class="title">
	                     	地图
	                     </div>
	                     <div class="content">
	                     	<div id="baidu_map" style="width: 750px;height: 300px;"></div>
	                     </div>
	                </div>
	            </div>
                
            </div>
            <!-- right--end-->
            
        </div>
    </div>
    <!-- part2--end-->
    
    <div class="foot_seperate"></div>
	    <!-- foot-->
	    <%@include file="../common/footer.jsp" %>
	    <!-- foot--end-->
    <script type="text/javascript">
	    function showCal(tid){
	 	   var obj=$(".m_calendar_wrap");
	 	   if(obj.size()==0){
	 		   $("#sc_cal_"+tid).load("ticketCalendar.htm?ticketId="+tid,function(){
	 			   $(".m_calendar_wrap").slideDown();
	 		   });
	 	   }else{
	 		   obj.slideUp(function(){
	 			   obj.remove();
	 		   });
	 	   }
	 	}
	    function activity(){
		 	$("#con_activity").show().siblings().hide();
		 	$("#li_activity").addClass("current").siblings().removeClass("current");
		}
	    function desc(){
		 	$("#con_desc").show().siblings().hide();
		 	$("#li_desc").addClass("current").siblings().removeClass("current");
		}
	    function traffic(){
		 	$("#con_traffic").show().siblings().hide();
		 	$("#li_traffic").addClass("current").siblings().removeClass("current");
		}
		$(function(){
			initPro("${scenic.province}",$("#province"));
			initCity("${scenic.city}",$("#city"));
			initCounty("${scenic.county}",$("#county"));
			initCity("${scenic.city}",$("#district"));
			
			COOL.showMap("baidu_map","${scenic.lng}","${scenic.lat}");
		});	
	</script>
</body>
</html>